<!DOCTYPE html><!--引入thymeleaf模板引擎-->
<html lang="zh">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>顶部</title>
    <link href="/home/css/style.css" rel="stylesheet" type="text/css"/>
    <link href="/home/css/common.css" rel="stylesheet" type="text/css"/>
    <script type="text/javascript" src="/home/js/jquery-3.5.1.js"></script>
    <script type="text/javascript" src="/home/js/vue.js"></script>
    <script type="text/javascript" src="/home/js/axios.js"></script>
    <script type="text/javascript" src="/home/js/config.js"></script>
    <style type="text/css">
        .top_hr span {
            color: #ccc;
            margin-left: 10px;
        }

        .top_hw {
            background: url(/home/img/top_h.jpg) repeat-x;
            height: 28px;
            line-height: 28px;
            width: 100%;
        }

        .top_h {
            width: 1080px;
            margin: 0 auto;
        }

        .top_h .top_hl {
            float: left;
        }

        .top_h .top_hl span {
            color: #666;
        }

        .top_h .top_hl b {
            color: #ec0000;
        }

        .top_h .top_hr {
            float: right;
            color: #cccccc;
        }

        .top_h .top_hr a {
            margin: 0 5px;
        }

        /* 下拉菜单样式 */
        .user-dropdown {
            position: relative;
            display: inline-block;
        }

        .dropdown-content {
            position: absolute;
            right: 0;
            background-color: #333;
            min-width: 120px;
            box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
            z-index: 1000;
            border-radius: 4px;
            overflow: hidden;
        }

        .dropdown-content a:hover {
            background-color: #555;
        }

        .clearfix:after {
            clear: both;
            content: ' ';
            display: block;
            font-size: 0;
            line-height: 0;
            visibility: hidden;
            width: 0;
            height: 0;
        }

        .clearfix {
            display: inline-block;
        }

        * html .clearfix {
            height: 1%;
        }

        .clearfix {
            display: block;
            *zoom: 1;
        }

        a {
            color: #3480e2;
            text-decoration: none;
            outline: none;
        }

        .top_h .top_hl span {
            color: #666;
        }

        body {
            margin-top: 0;
            font-size: 14px;
            line-height: 1.5;
            font-family: "Hiragino Sans GB", "Microsoft YaHei", SimHei, SimSun, sans-serif;
            color: #333;
        }
    </style>

    <script>
        function Logout() {
            let confirm = window.confirm("您确定要退出当前系统嘛？");
            if (confirm === true) {
                // 获取用户ID
                const userId = localStorage.getItem("USER_ID") || sessionStorage.getItem("userId");

                if (!userId) {
                    alert("未找到用户信息，请重新登录！");
                    window.location = "http://localhost:80/index.html";
                    return;
                }

                // 使用axios方法发送请求
                axios.post(`/home/logout/${userId}`)
                    .then(function (resp) {
                        console.log('退出登录响应:', resp);
                        if (resp && resp.data.code === 200) {
                            alert("你已经成功退出系统！！！");
                            //清除localStorage
                            localStorage.removeItem("USER_ID");
                            localStorage.removeItem("saToken");
                            sessionStorage.removeItem("userId");

                            window.location = "http://localhost:80/home/index.html";
                        } else {
                            alert("退出系统失败，请刷新页面重试！" + (resp ? resp.message : ''));
                        }
                    })
                    .catch(function (error) {
                        console.error('退出登录错误:', error);
                        alert("网络访问失败,请检查网络");
                    });
            }
        }
    </script>
</head>
<body>
<div class="top_hw clearfix">
    <div class="top_h clearfix ">
        <div class="top_hl"><span>欢迎来到中国梦想旅游网，让你的梦想全程免费自由行！</span> 预定热线：<b>0939-12345678</b>
        </div>

        <div class="top_hr">
            <a href="https://www.12306.cn/" target="_blank">铁路12306 <span>|</span> </a>
            <a href="https://trains.ctrip.com/" target="_blank">携程网 <span>|</span> </a>

            <div id="user-status"></div>
            <script>
                // 检查用户登录状态
                $(document).ready(function () {
                    // 使用config.js中已经设置的baseURL
                    axios.defaults.headers.common['Content-Type'] = 'application/json';

                    // 使用axios发送GET请求检查登录状态
                    axios.get('/admin/user_manage/checkLogin', {
                        params: {
                            userId: localStorage.getItem("USER_ID")
                        }
                    })
                        .then(function (response) {
                            // 处理成功响应
                            let data = response.data.data;
                            // 判断data是否存在且包含username字段
                            if (data && data.username) {
                                // 用户已登录
                                $('#user-status').html(
                                    '<div class="user-dropdown">' +
                                    '<a href="#" class="dropdown-toggle" style="color: white">' +
                                    '<span style="color: white;font-size: 14px; margin-left: 0px">您好,</span>' +
                                    data.username +
                                    '<span style="color: white">|</span>' +
                                    '</a>' +
                                    '<div class="dropdown-content" style="display: none;">' +
                                    '<a href="/home/center/personal/info.html" style="color: white;display: block;padding: 5px 10px;text-decoration: none;">个人中心</a>' +
                                    '<a href="/home/center/passenger/passengers.html" style="color: white;display: block;padding: 5px 10px;text-decoration: none;">我的乘车人</a>' +
                                    '<a href="/home/center/ticket/my_tickets.html" style="color: white;display: block;padding: 5px 10px;text-decoration: none;">我的车票</a>' +
                                    '<a href="/home/center/order/historyOrder.html" style="color: white;display: block;padding: 5px 10px;text-decoration: none;">我的历史订单</a>' +
                                    '</div>' +
                                    '</div>' +
                                    '<a href="javascript:void(0);" onclick="Logout()" style="color: white">退出</a>'
                                );

                                // 为下拉菜单添加点击事件
                                $(document).ready(function () {
                                    $('.user-dropdown').on('click', function (e) {
                                        e.stopPropagation(); // 阻止事件冒泡
                                        $(this).find('.dropdown-content').toggle();
                                    });

                                    // 点击页面其他地方关闭下拉菜单
                                    $(document).on('click', function () {
                                        $('.dropdown-content').hide();
                                    });
                                });
                            } else {
                                // 用户未登录
                                $('#user-status').html(
                                    '<a href="/home/login.html" target="_top" style="color: white">登录<span style="color: white">|</span></a>' +
                                    '<a href="/home/register.html" target="_top" style="color: white">注册</a>'
                                );
                            }
                        })
                        .catch(function (error) {
                            // 处理错误
                            console.error('检查登录状态失败:', error);
                            // 出错时默认显示未登录状态
                            $('#user-status').html(
                                '<a href="/home/login.html" target="_top">登录<span>|</span></a>' +
                                '<a href="/home/register.html" target="_top">注册</a>'
                            );
                        });
                });
            </script>
        </div>

    </div>
</div>
<div class="mainNav clearfix">
    <ul class="Nav_ul">
        <li><a href="/home/index.html">首页</a><img src="/home/img/nav_line.jpg"></li>
        <li><a href="#">旅游路线</a><img src="/home/img/nav_line.jpg"></li>
        <li><a href="#">旅游景点</a><img src="/home/img/nav_line.jpg"></li>
        <li><a href="#">餐饮住宿</a><img src="/home/img/nav_line.jpg"></li>
        <li><a href="#">交通线路</a><img src="/home/img/nav_line.jpg"></li>
        <li><a href="#">旅游团购</a><img src="/home/img/nav_line.jpg"></li>
        <li><a href="#">地方特产</a><img src="/home/img/nav_line.jpg"></li>
        <li><a href="#">出行指南</a><img src="/home/img/nav_line.jpg"></li>

    </ul>
</div>


</body>
</html>
